<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title></title>
		<script src="js/mui.min.js"></script>
		<link href="css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" type="text/css" href="css/style.css" />
		<link rel="stylesheet" type="text/css" href="css/iconfont.css"/>
		<script type="text/javascript" charset="utf-8">
			mui.init();
		</script>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav">
			<h1 class="mui-title"></h1>
		</header>
		<div class="mui-content">
			<div class="box">
				<div class="userinfo">
					<img src="img/userinfo.png" id="img1"/>
					<h4>张增强</h4>
					<span class="mui-icon mui-icon-arrowright"></span>
				</div>
				<div class="fourbtn">
					<div>
						<span>10</span>
						<h5>动态</h5>
					</div>
					<div>
						<span>20</span>
						<h5>关注</h5>
					</div>
					<div>
						<span>30</span>
						<h5>粉丝</h5>
					</div>
					<div>
						<span>30</span>
						<h5>7天访客</h5>
					</div>
				</div>
			</div>
				<div class="threebtn">
					<div>
						<span class="mui-icon iconfont icon-staro c1"></span>
						<h5>收藏</h5>
					</div>
					<div>
						<span class="mui-icon iconfont icon-lishi-copy c2"></span>
						<h5>历史</h5>
					</div>
					<div>
						<span class="mui-icon iconfont icon-yejianmoshi c3"></span>
						<h5>夜间</h5>
					</div>
				</div>
				<div class="lists">
					<ul class="mui-table-view">
					        <li class="mui-table-view-cell">
					            <a class="mui-navigate-right">
					                <span>消息通知
					                	<span class="mui-badge mui-badge-red badgered">3</span>
					                </span>
					            </a>
					        </li>
					    </ul>
					<ul class="mui-table-view">
						<li class="mui-table-view-cell">
					            <a class="mui-navigate-right">
					                 <span>头条商城</span>
					                 <span class="righttext">邀请好友得现金奖励</span>
					            </a>
					        </li>
					        <li class="mui-table-view-cell">
					            <a class="mui-navigate-right">
					                 <span>京东特供</span>
					                 <span class="righttext">新人领188红包</span>
					            </a>
					        </li>
					</ul>
					<ul class="mui-table-view">
					        <li class="mui-table-view-cell">
					            <a class="mui-navigate-right">
					            	<span class="mui-icon mui-icon-camera cellicon bg1"></span>
					                <span>我要爆料</span>
					            </a>
					        </li>
					        <li class="mui-table-view-cell">
					            <a class="mui-navigate-right">
					            	<span class="mui-icon mui-icon-circle-filled cellicon bg2"></span>
					                 <span>用户反馈</span>
					            </a>
					        </li>
					        <li class="mui-table-view-cell">
					            <a class="mui-navigate-right">
					            	<span class="mui-icon mui-icon-settings cellicon bg3"></span>
					                 <span>系统设置</span>
					            </a>
					        </li>
					    </ul>
				</div>
		</div>
		<script src="js/castapp.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			ca.init();
			
			var img1 = ca.id('img1');
			img1.addEventListener('tap', function(){
				var arr = ['照相机', '相册'];
				
				castapp.actionSheet(arr, {
					succFn:function(data){
						console.log(data);
						img1.src = data;
					},
					errFn:function(data){
						alert(data);
					},
					isUpload:false,
					uploadUrl:''
				});
			});
		</script>
	</body>

</html>